<template>
    <div>
        购物车页
        <input type="text" @change="changeFn">
        <!-- 使用子组件 -->
        <CartChild></CartChild>
    </div>
</template>

<script setup lang="ts">
import { provide, ref } from 'vue'
import CartChild from '@/components/Cartchild.vue'
// 为事件处理函数标注类型
// Event 为事件对象类型

const changeFn = (e: Event) => {

    console.log((e.target as HTMLInputElement).value);
}



//为provide 和 inject 标注类型
// 第一种方式(推荐): 
const nameArr = ref(['貂蝉', '杨玉环', '西施', '王昭君']);
provide('namearrkey', nameArr)

// 第二种方式(不推荐);
import { key } from './mykey';
const girlObj = ref({ name: '花木兰', age: 20 });
provide(key, girlObj)








</script>
<style scoped></style>